<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>浮动场景1：文字与图片环绕</title>
		<style>
			img{
				/* 图片脱离文档流--文字包含在图片周边 */
				float: left;
				margin-right:50px ;/* 图片与文字链接处间隙 */
				margin-bottom: 50px;
			}
			p{
				font-size: 16px; /* 页面默认字体尺寸*/
				line-height: 20px;/* 浮动文字 行高无法设定*/
				word-spacing: 20px;
			}
		</style>
	</head>
	<body>
		<h1>浮动之图片文字环绕</h1>
		<img  src="img/3.png" alt="赞" width="250px" height="250px" height="250px">
		<p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Dignissimos obcaecati nulla tempore voluptate id quibusdam corporis similique earum incidunt itaque, eos aspernatur, laborum fugit labore, temporibus recusandae porro impedit sequi. Lorem ipsum, dolor sit amet consectetur adipisicing elit. Odit vero omnis repellat facilis at ea laudantium quas perspiciatis perferendis consequuntur, iste minima expedita magni totam id animi iusto nulla eius! Lorem, ipsum dolor sit amet consectetur adipisicing elit. Itaque harum odit odio? Quibusdam rerum eum ullam. Nulla pariatur nesciunt consequatur expedita, incidunt iure inventore quidem quas reprehenderit tenetur quibusdam? Mollitia.</p>
	</body>
</html>